14.7 KB · ⇊ 9 parts · ⤓ Micron 14.7 KB · ⤓ HTML 36.3 KB

top

React (aussi appelé React.js ou ReactJS) est une bibliothèque open source JavaScript pour créer des interfaces utilisateurs. Elle est maintenue par Meta (anciennement Facebook) ainsi que par une communauté de développeurs individuels et d'entreprises depuis 2013.

Le but principal de cette bibliothèque est de faciliter la création d'application web monopage, via la création de composants dépendant d'un état et générant une page (ou portion) HTML à chaque changement d'état.

React est une bibliothèque qui ne gère que l'interface de l'application, cette interface étant considérée comme la vue dans le modèle MVC. Elle peut ainsi être utilisée avec une autre bibliothèque ou un framework MVC comme AngularJS. La bibliothèque se démarque de ses concurrents par sa flexibilité et ses performances, en travaillant avec un DOM virtuel et en ne mettant à jour le rendu dans le navigateur qu'en cas de nécessitécite-ref-medium-baer-2-0[2].

• Historique

• Fonctionnalités

• DOM virtuel

• Adoption et Utilisation

• Notes et références

React a été créé par Jordan Walke, un ingénieur chez Meta. Jordan Walke a d'abord développé un prototype nommé « FaxJS »cite-ref-3[3]cite-ref-4[4]. Il a été déployé pour la première fois sur le fil d'actualité de Facebook en 2011.

React s'inspire de XHP (en), une bibliothèque également développée par Meta, permettant l'inclusion de HTML au sein de PHPcite-ref-5[5]cite-ref-6[6].

Pete Hunt, ingénieur travaillant sur Instagram est intéressé par la bibliothèque et assiste Walke afin de retirer les portions dépendantes de Facebook. Ceci permet à React d'être publié sous licence Apache 2.0 le 29 mai 2013.

En octobre 2014, la version 0.12.0 est publiée sous licence BSD modifiée, avec une note associée PATENTS permettant l'utilisation des brevets de Facebook associé à Reactcite-ref-7[7]. Cependant, la licence BSD est mise à jour en avril 2015, avec la version 0.13.1, pour éviter les confusionscite-ref-8[8].

React Native est annoncé en Février 2015 et disponible en version open source en Mars 2015. Ce framework est basé sur React et permet de créer, toujours en Javascript, des applications multi-plateformes Android et iOScite-ref-9[9].

Le 26 septembre 2017, React 16.0 a été publié sous la licence MITcite-ref-10[10]. Ce changement porte aussi sur la version 15.x avec React 15.6.2cite-ref-11[11].

La version 17.0 est publiée le 20 octobre 2020, première version majeure sans nouvelle fonctionnalité majeurecite-ref-12[12].

La React 18 est publié le 29 mars 2022, introduisant un nouveau moteur de rendu concurrent, le traitement par lots côté serveur, le rendu streamé côté serveur prenant pleinement en charge Suspensecite-ref-13[13].

La version 19 est annoncée le 25 avril 2024 et est disponible en betacite-ref-14[14]. Elle propose des améliorationscite-ref-15[15] importantes comme le rendu côté serveur, déjà utilisé par NextJS.

React a été conçu comme étant une bibliothèque et non un framework MVC, comme peuvent l'être ses concurrentscite-ref-why-react-16-0[16]. Ainsi, React encourage la création de composants réutilisables, avec en entrée des données, pouvant changer au cours du tempscite-ref-why-react-16-1[16].

Par ailleurs, React n'utilise pas de système de templates et ne fonctionne qu'avec du JavaScript, permettant une insertion complète du composant au sein d'une unique classecite-ref-why-react-16-2[16]. Pour faciliter l'écriture de la vue, l'équipe initiale chez Facebook a développé un langage, JSX, qui permet de générer des objets Javascript avec une notation similaire à HTMLcite-ref-jsx-in-depth-17-0[17].

Un DOM Virtuel est une représentation du DOM en JavaScript. Au lieu de générer le DOM lui-même comme avec un langage de templating, c'est-à-dire au lieu de dialoguer avec les API du navigateur pour construire le DOM, on ne génère qu'une arborescence d'objets JavaScript en mémoirecite-ref-18[18], répercutée auprès du navigateur quand opportun.

La bibliothèque est utilisée par Netflixcite-ref-19[19] (depuis le 25 octobre 2017, une migration de la partie client vers du JavaScript pur a permis d'augmenter les performances de 50 %cite-ref-20[20]), Yahoocite-ref-21[21], Airbnbcite-ref-22[22], Sonycite-ref-23[23], Atlassiancite-ref-24[24].

Les équipes de Meta pratiquent l'autoéquipement sur les réseaux sociaux Facebook, Instagram ou encore WhatsAppcite-ref-medium-baer-2-1[2].

À la fin de 2015, WordPress.com annonce Gutenberg, une interface pour les éditeurs de sites WordPress, développée en JavaScript avec Node.js et Reactcite-ref-25[25]cite-ref-26[26].

cite-note-wikidata-a8306b47ecf2bef8ac90a40d68a193da0696602e-11. « https://github.com/facebook/react/releases/tag/v19.2.0 »

cite-note-medium-baer-22. baer2015eric-baer2015(en) Eric Baer, « Using React is a Business Decision, Not a Technology Choice », sur Medium, 4 décembre 2015 (consulté le 21 décembre 2015).

cite-note-33. ↑ walke2011jordan-walke2011(en) Jordan Walke, « Page GitHub de FaxJs », 19 septembre 2011 (consulté le 16 novembre 2023).

cite-note-44. ↑ h-mori2018ferenc-h-mori2018(en-US) Ferenc Hámori, « The History of React.js on a Timeline », sur RisingStack Engineering, 4 avril 2018 (consulté le 16 novembre 2023).

cite-note-55. ↑ krill2014paul-krill2014(en) Paul Krill, « React: Making faster, smoother UIs for data-driven Web apps », 15 mai 2014 (consulté le 6 avril 2015).

cite-note-66. ↑ « Releases - facebook/react », sur github.com (consulté le 6 avril 2015).

cite-note-77. ↑ 2014« README.md », 28 octobre 2014.

cite-note-88. ↑ 2015(en) « Updating Our Open Source Patent Grant », 10 avril 2015 (consulté le 21 décembre 2015).

cite-note-99. ↑ (en) « React Native Learn once, write anywhere. », sur React Native (consulté le 14 janvier 2024).

cite-note-1010. ↑ 2017« React v16.0 », React Blog,‎ 26 septembre 2017 (lire en ligne, consulté le 28 septembre 2017).

cite-note-1111. ↑ 2017« React v15.6.2 », React Blog,‎ 25 septembre 2017 (lire en ligne, consulté le 28 septembre 2017).

cite-note-1212. ↑ (en) « React v17.0 – React Blog », sur legacy.reactjs.org (consulté le 6 août 2024)

cite-note-1313. ↑ « React v18.0 – React », sur fr.react.dev (consulté le 6 août 2024)

cite-note-1414. ↑ (en) « React 19 RC – React », sur react.dev (consulté le 6 août 2024)

cite-note-1515. ↑ leuillet2024louis-nicolas-leuillet2024Louis-Nicolas Leuillet, « Les nouveautés de React 19 », sur believemy.com, 20 mai 2024 (consulté le 13 juillet 2024)

cite-note-why-react-1616. hunt2013pete-hunt2013(en) Pete Hunt, « Why did we build React? », sur facebook.github.io, 5 juin 2013 (consulté le 6 avril 2015).

cite-note-jsx-in-depth-1717. ↑ (en) « JSX in Depth », sur facebook.github.io (consulté le 6 avril 2015).

cite-note-1818. ↑ combelles2016christophe-combelles2016Christophe Combelles, « Une brève histoire du DOM (jusqu’à React et Redux) », sur gorfou.fr, 25 août 2016 (consulté le 27 juillet 2020).

cite-note-1919. ↑ 2015« React.js Conf 2015 », sur Youtube, 4 février 2015.

cite-note-2020. ↑ « Netflix UI Engineers on Twitter », sur Twitter (consulté le 27 juillet 2020).

cite-note-2121. ↑ « Yahoo Mail moving to React », sur Slideshare.

cite-note-2222. ↑ 2014(en) « Dev Chats: Spike Brehm of Airbnb - JavaScript development without a "greenfield app" », sur Medium, 2 septembre 2014.

cite-note-2323. ↑ 2015« Mikael Brassman on Twitter: "Sony's Lifelog newly released web interface is using #refluxjs and #reactjs on the client-side" », sur Twitter, 7 janvier 2015.

cite-note-2424. ↑ 2014« Wesley Walser on Twitter: "React.js is now driving @atlassian OnDemand billing pages. Small project to start adoption, positive experiences thus far." », sur Twitter, 19 juin 2014.

cite-note-2525. ↑ « La nouvelle expérience d'édition Gutenberg », sur La nouvelle expérience d'édition Gutenberg (consulté le 15 avril 2020).

cite-note-2626. ↑ 2018(en-US) « WordPress 5.0 “Bebo” », sur WordPress News, 6 décembre 2018 (consulté le 15 avril 2020).

• Portail de la programmation informatique